<template>
  <el-date-picker
    v-model="dateRange"
    type="daterange"
    range-separator="-"
    value-format="YYYY-MM-DD"
    style="width: 230px;"
    clearable
    start-placeholder="开始日期"
    end-placeholder="结束日期"
    @change="handleChange"
  />
</template>

<script>
export default defineComponent({
  props: {
    index: {
      type: Number,
      default: 0
    },
    itemData: {
      type: Object,
      default: {}
    },
    value:{
      type:Array,
      default:()=>[]
    }
  },
  setup(props, context) {
    const dateRange = ref(props.value)
    const handleChange = () => {
      dateRange.value = [dateRange.value[0] + ' 00:00:00', dateRange.value[1] + ' 23:59:59']
      context.emit('handleChange', dateRange, props.index, props.itemData)
    }
    return {
      dateRange,
      handleChange,
    }
  },
});
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
</style>
